﻿@model Vizzio.Models.Producto

@{
    ViewBag.Title = "Editar Producto";
}

<h2>Editar Producto</h2>

<div id="contenedor_principal">
    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken()

        <div class="form-horizontal">
            <h4>Producto</h4>
            <p>Todos los campos con * son obligatorios</p>
            <hr />
            @Html.ValidationSummary(true)
            @Html.HiddenFor(model => model.ProductoID)

            <div class="control-group form-group">
                @Html.LabelFor(model => model.Nombre, "* Nombre", new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.TextBoxFor(model => model.Nombre, new { @class = "form-control", required = "", data_validation_required_message = "Campo requerido", maxlength = "30", data_validation_maxlength_message = "Muy largo: Ingrese 30 o menos caracteres", minlength = "1", data_validation_minlength_message = "Muy corto: Ingrese al menos 1 caracter", data_validation_regex_regex = "[A-ZñÑa-z0-9_&\\-\\.,#\\/ ]+", data_validation_regex_message = "Solo caracteres Alfanumericos incluido [-_.,_/#&]", data_validation_callback_callback = "validar_nombre_producto_repetido" })
                    <p class="help-block">Requerido: 1 a 30 Caracteres Alfanumericos</p>
                </div>
            </div>

            <div class="control-group form-group" id="divPresentacion">
                @Html.LabelFor(model => model.Presentacion, "* Presentacion", new { @class = "control-label col-md-2 control-label" })
                <div class="col-md-10 presentaciones row">
                    <div class="presentaciones_hijo col-lg-4">
                        @Html.DropDownList("PresentacionID", null, "-Elija una presentacion-", new { @class = "campoPresentacion" })
                    </div>
                    <div class="col-lg-2">
                        <a class="btn btn-info btn-sm" href="#" data-toggle="modal" data-target="#myModal">
                            <span class="glyphicon glyphicon-plus"></span> Nueva Presentacion
                        </a>
                        @*<p class="help-block" style="color:red" id="presentacion_message">No registrado, datos erroneos...</p>*@
                    </div>

                </div>
            </div>

            <div class="control-group form-group">
                @Html.LabelFor(model => model.Empresa, "* Empresa", new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.TextBoxFor(model => model.Empresa, new { @class = "form-control", required = "", data_validation_required_message = "Campo requerido", maxlength = "30", data_validation_maxlength_message = "Muy largo: Ingrese 30 o menos caracteres", minlength = "1", data_validation_minlength_message = "Muy corto: Ingrese al menos 1 caracter", data_validation_regex_regex = "[A-ZñÑa-z0-9_&\\-\\.,#\\/ ]+", data_validation_regex_message = "Solo caracteres Alfanumericos incluido [-_.,_/#&]" })
                    <p class="help-block">Requerido: 1 a 30 Caracteres Alfanumericos</p>
                </div>
            </div>

            @*<div class="control-group form-group">
                    @Html.LabelFor(model => model.Precio,"* Precio", new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.TextBoxFor(model => model.Precio, new { @class = "form-control", required = "", maxlength = "10", data_validation_maxlength_message = "Muy largo: Ingrese 10 o menos digitos", data_validation_required_message = "Campo requerido", max = "9999999", data_validation_max_message = "Demaciado grande: Debe ser menor a 9999999.99", min = "1", data_validation_min_message = "Debe ser mayor a 0", data_validation_regex_regex = "([0-9]+)([,]{0,1}[0-9]{1,2}){0,1}", data_validation_regex_message = "Solo numeros con 2 decimales a lo mucho. Separador decimal: [ , ]" })
                        <p class="help-block">Requerido: Valor decimal entre 1 y 9999999.99 </p>
                    </div>
                </div>

                <div class="control-group form-group">
                    @Html.LabelFor(model => model.Stock,"* cantidad", new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.TextBoxFor(model => model.Stock, new { @class = "form-control", required = "", maxlength = "5", data_validation_maxlength_message = "Muy largo: Ingrese menos de 5 digitos", data_validation_required_message = "Campo requerido", max = "99999", data_validation_max_message = "Demaciado grande: Debe ser menor o igual a 99999", min = "0", data_validation_min_message = "Debe ser mayor o igual a 0", data_validation_number_message = "Solo puede ingresar numeros enteros." })
                        <p class="help-block">Requerido: Valor numerico entre 0 y 99999</p>
                    </div>
                </div>*@

            <div class="control-group form-group">
                @Html.LabelFor(model => model.StockMinimo, "* Stock Minimo", new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.TextBoxFor(model => model.StockMinimo, new { @class = "form-control", required = "", maxlength = "4", data_validation_maxlength_message = "Muy largo: Ingrese menos de 4 digitos", data_validation_required_message = "Campo requerido", max = "9999", data_validation_max_message = "Demaciado grande: Debe ser menor o igual a 9999", min = "0", data_validation_min_message = "Debe ser mayor o igual a 0", data_validation_number_message = "Solo puede ingresar numeros enteros" })
                    <p class="help-block">Valor numerico entre 0 y 9999</p>
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="submit" value="Modificar" class="btn btn-primary" />
                </div>
            </div>
        </div>

    }

    <div>
        @Html.ActionLink("Cancelar", "Index", null, new { @class = "btn btn-success" })
    </div>

    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <center><h4 class="modal-title" id="myModalLabel">Registrar Presentacion</h4></center>
                </div>
                <div class="modal-body">
                    <p><h4>Datos de la Presentacion</h4></p>

                    <p><h6>Todos los campos con * son obligatorios</h6></p>
                    <hr />
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="NombrePresentacion" class="col-sm-4 control-label">* Nombre de La presentacion</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" id="NombrePresentacion" placeholder="Presentacion">
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="DescripcionPresentacion" class="col-sm-4 control-label">Descripcion de La presentacion</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" id="DescripcionPresentacion" placeholder="Descripcion">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" id="registrar_presentacion">Registrar</button>
                </div>
            </div>
        </div>
    </div>
</div>
    @section Scripts {
        <script>
            $(function () { $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(); });
            $(("select.campoPresentacion")).combobox();



            $("#registrar_presentacion").click(function () {
                if ($("#NombrePresentacion").val() == "") {
                    alert("No registrado, debe ingresar un nombre de presentacion");
                }
                else {
                    var obj = { NombrePresentacion: $("#NombrePresentacion").val(), Descripcion: $("#DescripcionPresentacion").val() };
                    var elementoHtml = $(this);
                    var presentaciones = null;
                    $.ajax({
                        type: "POST",
                        // lugar donde se aloja nuestro web service
                        url: "http://localhost:6490/Service/WebServiceGetProductos.asmx/RegistrarPresentacion",
                        dataType: "json",
                        data: JSON.stringify(obj),
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {


                            presentaciones = JSON.parse(data.d);
                            var contenedor_principal = $(elementoHtml).closest("div#contenedor_principal");

                            //Eliminar lista anterior
                            var aux = contenedor_principal.find("div.presentaciones_hijo");
                            aux.remove();

                            //Crear nueva lista
                            var selectList = "<div class='presentaciones_hijo col-lg-4'><select name='PresentacionID' id='Presentaciones' data_validation_callback_callback = 'validar_nombre_producto_repetido'  class='campoPresentacion' required><option></option>";
                            $.each(presentaciones, function (index, presentacion) {
                                selectList += "<option value='" + presentacion.PresentacionID + "'>" + presentacion.NombrePresentacion + "</option>";
                                //alert(presentacion.NombrePresentacion);
                            });
                            selectList += "</select></div>";

                            //Agregar lista de clientes
                            contenedor_principal.find(".presentaciones").prepend(selectList);

                            //Activamos el combobox para que sea un autocomplete selectbox
                            $(("select.campoPresentacion")).combobox();
                            //---------------------------------------------------Activa la validacion de los campos (Cargados estaticamente) ----------------------------------------//
                            $(function () { $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(); });



                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            alert(textStatus + " Error: " + XMLHttpRequest.responseText);
                        }
                    });
                }
            });

        </script>


        <script>
            function validar_nombre_producto_repetido($el, value, validar_nombre) {
                var present = $("input[name='PresentacionID']").val();
                //alert(present);
                var obj = { Nombre: $("#NombreProducto").val(), Presentacion: present };//Datos enviados
                $.ajax({
                    type: "POST",
                    url: "http://localhost:6490/Service/WebServiceGetProductos.asmx/NuevoNombreProductoDisponible",
                    dataType: "json",
                    data: JSON.stringify(obj),
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        validar_nombre({
                            value: value,
                            valid: JSON.parse(data.d),
                            message: "Duplicidad: El producto ingresado ya fue registrado!!"
                        });
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(textStatus + " Error: " + XMLHttpRequest.responseText);
                    }
                });
            }
        </script>
        @Scripts.Render("~/bundles/jqueryval")
    }
